<template>
  <div class="main_right">
    <!-- 实时告警 -->
    <div class="box top">
      <!-- 标题 -->
      <h1 class="left-title">实时告警文件</h1>
      <div class="boxC">
        <el-empty v-if="vioArr.length==0"></el-empty>
        <file-thing :dataArr="vioArr" v-else/>
      </div>
    </div>
    <!-- 外发文件 -->
    <div class="box bottom">
      <h1 class="left-title">外发文件</h1>
      <!-- 小模块部分 -->
      <div class="boxC">

        <el-empty v-if="outgoingArr.length==0"></el-empty>
        <file-thing :dataArr="outgoingArr" :longtime="true" v-else/>
      </div>
    </div>
  </div>
</template>

<script>
import CycleComponent from "@/components/common/cycleComponent.vue";  
import FileThing from "./moduleComponments/fileThing.vue";
import { outgoingLog, violations } from "@/api/mainPage";

export default {
  components: { FileThing, CycleComponent },

  data() {
    return {
      vioArr: [],
      outgoingArr: [{}],
    };
  },
  methods: {
    getData() {
      outgoingLog().then((res) => {
        this.outgoingArr = res;
      });
      violations().then((res) => {
        this.vioArr = res;
      });
    },
  },
  mounted() {
    this.getData();
  },
};
</script>

<style lang="scss" scoped>
.main_right {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
}
.top,
.bottom {
  height: 49%;
  display: flex;
  flex-direction: column;
}

.boxC {
  flex: 1;
  padding: 0.625rem 0.625rem 1.25rem;
  overflow: hidden;
  max-height: calc(50vh - 8.75rem);
}
</style>